<!doctype html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
	<meta name="robots" content="index, follow">
    <link rel="shortcut icon" type="image/png" href="favicon.png">

	<link rel="stylesheet" type="text/css" href="./css/bootstrap.min.css?9188" th:href="@{/css/bootstrap.min.css?9188}">
	<link rel="stylesheet" type="text/css" href="../../static/css/style.css?8116" th:href="@{/css/style.css?8116}">
	<link rel="stylesheet" type="text/css" href="../../static/css/style.css?8116" th:href="@{/css/all.min.css?}">
	<link rel="stylesheet" type="text/css" href="./css/animate.min.css?7456" th:href="@{/css/animate.min.css?8901}">
	<link href='https://fonts.googleapis.com/css?family=Josefin+Sans&display=swap&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
	<link href='https://fonts.googleapis.com/css?family=Lato:100,300,400,700,900&display=swap&subset=latin,latin-ext' rel='stylesheet' type='text/css'>

	<!-- Bootstrap 核心 CSS 文件 -->

	<link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
	<script src="" th:src="@{/js/jquery.min.js}"></script>

	<!--  Bootstrap 核心 JavaScript 文件 -->
	<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>

	<link rel="stylesheet" type="text/css" th:href="@{/css/bootstrap-select.min.css}"  href="bootstrap-select.min.css">
	<script src="bootstrap-select.min.js" th:src="@{/js/bootstrap-select.min.js}"></script>
	<script src="/bootstrap/defaults-zh_CN.js" th:src="@{js/i18n/defaults-zh_CN.js}"></script>
	<title>assign_contract</title>


    
<!-- Analytics -->
 
<!-- Analytics END -->
    
</head>
<body>


<!-- Main container -->
<div class="page-container">
    
<!-- bloc-0 -->
<div class="bloc bg1 bgc-azure l-bloc" id="bloc-0">
	<div class="container bloc-sm">
		<div class="row">
			<div class="col">
				<nav th:replace="_fragments :: nav" class="navbar navbar-light row navbar-expand-md nav-invert" role="navigation">
					<button id="nav-toggle" type="button" class="ui-navbar-toggler navbar-toggler border-0 p-0" data-toggle="collapse" data-target=".navbar-27707" aria-expanded="false" aria-label="Toggle navigation">
						<span class="navbar-toggler-icon"></span>
					</button>
					<div class="collapse navbar-collapse navbar-27707">
						<ul class="site-navigation nav navbar-nav">
							<li class="nav-item">
								<a href="loginup.html" th:href="@{/}" class="nav-link a-btn ltc-white">首页</a>
							</li>
							<li th:if="${session.nowUser.ifHasRight(1)}" class="nav-item">
								<a href="contract/draft.html" th:href="@{/toDraft}" class="nav-link a-btn ltc-white">起草合同</a>
							</li>
							<li th:if="${session.nowUser.ifHasRight(5)}" class="nav-item">
								<a href="select.html" th:href="@{/toCounterSign}" class="nav-link a-btn ltc-white">会签合同</a>
							</li>
							<li th:if="${session.nowUser.ifHasRight(2)}" class="nav-item">
								<a href="finalization.html" th:href="@{/toFinalize}" class="nav-link a-btn ltc-white">定稿合同</a>
							</li>
							<li th:if="${session.nowUser.ifHasRight(6)}" class="nav-item">
								<a href="approval.html" th:href="@{/toExamine}" class="nav-link a-btn ltc-white">审批合同</a>
							</li>
							<li th:if="${session.nowUser.ifHasRight(7)}" class="nav-item">
								<a href="sign.html" th:href="@{/toSign}" class="nav-link a-btn ltc-white">签订合同</a>
							</li>
						</ul>
					</div>
					<a class="navbar-brand mr-0" style="color: white" href="/toMe"> mcx <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" fill="currentColor" class="bi bi-person-fill" viewBox="0 0 16 16"><path d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z"/></svg></a>

				</nav>
			</div>
		</div>
	</div>
</div>
<!-- bloc-0 END -->

<!-- bloc-22 -->
<div class="bloc bg2 l-bloc" id="bloc-22">
	<div class="container bloc-lg"style="background-color: rgba(255,255,255,.2)">
		<div class="row" >
			<div class="col-lg-3"></div>
			<div class="col-lg-6 offset-sm-1 col-md-8 offset-md-2 text-md-left text-center offset-lg-0 ">
				<h1 class="mg-md">
					为合同分配人员<br>
				</h1>
				合同名:
				<h3 th:text="${contract.contractname}" class="mg-md">
					这里是合同名字
				</h3>
				<div >
					<br>

				</div>
			</div>
		</div>
		<div class="row"  th:if="${contract.getNeedAllocationProcess()[0]}">
				<div class="col-lg-3"></div>
				<div class="col-lg-6 ">
					<div class="card">
						<div class="card-header">
							<h3 class="mg-clear">
								会签合同
							</h3>
						</div>
						<div class="card-body">
							<div class="form-group">
								<div >
									<br>
								</div>
								<div class="">
									<select id="counterSignSelect" th:if="${session.nowUser.ifHasRight(8)}" class="form-control selectpicker" multiple data-live-search="true"  data-actions-box="true"  >
<!--										<option v-for="user in list_counterSign" :value="user.userid">{{user.username}}</option>-->
									</select>
									<select th:if="${!session.nowUser.ifHasRight(8)}" disabled class="form-control selectpicker" multiple data-live-search="true"  data-actions-box="true"  >
									</select>
									</div>
							</div>
						</div>
					</div>
				</div>

		</div>
		<div class="row">
			&nbsp;
		</div>
		<div class="row">
			&nbsp;
		</div>
		<div class="row" th:if="${contract.getNeedAllocationProcess()[2]}">
			<div class="col-lg-3"></div>
			<div class="col-lg-6">
				<div class="card">
					<div class="card-header">
						<h3 class="mg-clear">
							审批合同
						</h3>
					</div>
					<div class="card-body">
						<div >
							<br>

						</div>
						<div class="form-group">
							<select id="examSelect" th:if="${session.nowUser.ifHasRight(9)}" class="form-control selectpicker" multiple data-live-search="true"  data-actions-box="true"  >
<!--								<option v-for="user in list_exam" :value="user.userid">{{user.username}}</option>-->
							</select>
							<select th:if="${!session.nowUser.ifHasRight(9)}" disabled class="form-control selectpicker" multiple data-live-search="true"  data-actions-box="true"  >
							</select>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="row">
			&nbsp;
		</div>
		<div class="row">
			&nbsp;
		</div>
		<div class="row" th:if="${contract.getNeedAllocationProcess()[3]}">
			<div class="col-lg-3"></div>
			<div class="col-lg-6">
				<div class="card">
					<div class="card-header">
						<h3 class="mg-clear">
							签订合同
						</h3>
					</div>
					<div class="card-body">
						<div >
							<br>

						</div>
						<div class="form-group">
							<select id="signSelect" th:if="${session.nowUser.ifHasRight(10)}" class="form-control selectpicker" multiple data-live-search="true"  data-actions-box="true"  >
<!--								<option v-for="user in list_sign" :value="user.userid">{{user.username}}</option>-->
							</select>
							<select th:if="${!session.nowUser.ifHasRight(10)}" disabled class="form-control selectpicker" multiple data-live-search="true"  data-actions-box="true"  >
							</select>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="row">
			<div class="col-lg-4"></div>
			<div class="col-lg-4">
				<div >
					<br>

				</div>
				<button v-on:click="assignUser" class="btn btn-lg btn-button-style btn-azure bloc-button" type="submit">
						确定分配
					</button>
			</div>
			<div class="col-lg-4"></div>
		</div>
	</div>
</div>
<!-- bloc-22 END -->

<!-- ScrollToTop Button -->
<a class="bloc-button btn btn-d scrollToTop" onclick="scrollToTarget('1',this)"><svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 32 32"><path class="scroll-to-top-btn-icon" d="M30,22.656l-14-13-14,13"/></svg></a>
<!-- ScrollToTop Button END-->


<!-- bloc-2 -->
<div class="bloc l-bloc " id="bloc-2">
	<div class="container bloc-lg">
		<div class="row">
			<div class="col-12">
				<h5 class="mg-md text-lg-center">
					Thank ♥ You
				</h5>
				<p class="text-lg-center">
					Renxiang Jia,2024
				</p>
			</div>
		</div>
		<div class="row">


		</div>
	</div>
</div>
<!-- bloc-2 END -->
<input type="hidden" id="contractIdInput" th:value="${contract.contractid}">
</div>
<!-- Main container END -->


<script th:src="@{/js/vue.js}"  type="text/javascript" charset="utf-8"></script>
<script th:src="@{/js/axios.min.js}"  type="text/javascript" charset="utf-8"></script>

<script>
	var globalVue = new Vue({
		el:"#bloc-22",
		//定义数据
		data: {
			list_counterSign:[],
			list_exam:[],
			list_sign:[],
			//一些常量
			OK :200,
			CODE_ERROR:201,
			NAME_EXIST:202
		},
		//定义方法
		methods: {
			getUserList:function () {
				axios({
					method: "get",
					url: "/user/listUserByRight",
				}).then(function (value) {
					var map = value.data.object;
					//设置各个list
					globalVue.list_counterSign = map[5];
					globalVue.list_exam = map[6];
					globalVue.list_sign = map[7];
					//此处不能使用vue动态绑定，要手动一个个append否则会不显示
					for (let i = 0; i < globalVue.list_counterSign.length; i++) {
						var user = globalVue.list_counterSign[i];
						$('#counterSignSelect').append("<option value=" + user.userid + ">"+ user.username + "</option>")
					}
					for (let i = 0; i < globalVue.list_exam.length; i++) {
						var user = globalVue.list_exam[i];
						$('#examSelect').append("<option value=" + user.userid + ">"+ user.username + "</option>")
					}
					for (let i = 0; i < globalVue.list_sign.length; i++) {
						var user = globalVue.list_sign[i];
						$('#signSelect').append("<option value=" + user.userid + ">"+ user.username + "</option>")
					}
					$('#counterSignSelect').selectpicker('refresh');
					$('#counterSignSelect').selectpicker('render');
					$('#examSelect').selectpicker('refresh');
					$('#examSelect').selectpicker('render');
					$('#signSelect').selectpicker('refresh');
					$('#signSelect').selectpicker('render');
				});
			},
			assignUser:function () {
				var userMap = {};
				var contractId = $("#contractIdInput").val();
				//获取各个流程分配的人员
				var counterSignUser = [];
				var examUser = [];
				var signUser = [];
				//会签
				$("#counterSignSelect option:selected").each(function () {
					counterSignUser.push($(this).val());
				})
				//审批
				$("#examSelect option:selected").each(function () {
					examUser.push($(this).val());
				})
				//签订
				$("#signSelect option:selected").each(function () {
					signUser.push($(this).val());
				})
				userMap[5] = counterSignUser; //会签
				userMap[6] = examUser; //审批
				userMap[7] = signUser; //签订
				JSON.stringify(userMap);
				axios({
					method:"post",
					url: "/contract/assignUser",
					params:{contractId:contractId},
					data:userMap //这里千万不能加大括号！！！！！
				}).then(function (value) {
					alert("分配成功！即将返回上一个页面")
					window.location.replace(document.referrer);
				});
			}
		},
		mounted:function () {
			this.getUserList();
		}
	});
</script>
</body>
</html>
